<template>
  <el-dialog
    :title="`${type === 1 ? '入库记录' : '出库记录'}`"
    :visible.sync="dialogVisible"
    width="90%"
    @close="handleClose"
  >
    <el-table
      :data="tableData"
      border
      class="ware-table"
      :max-height="400"
      style="margin-top: 10px"
    >
      <el-table-column label="序号" width="50px" type="index"></el-table-column>
      <el-table-column
        label="进场时间"
        show-overflow-tooltip
        prop="enterTime"
        width="170px"
        align="center"
      ></el-table-column>
      <el-table-column
        label="进场单号"
        show-overflow-tooltip
        width="170"
        prop="code"
        align="center"
      ></el-table-column>
      <el-table-column label="物料编码" prop="materialCode"></el-table-column>
      <el-table-column label="物料类型" prop="materialTypeName"></el-table-column>
      <el-table-column
        label="材料名称"
        show-overflow-tooltip
        width="150"
        prop="materialName"
        align="center"
      ></el-table-column>
      <el-table-column
        label="规格型号"
        show-overflow-tooltip
        width="140"
        prop="spec"
        align="center"
      ></el-table-column>
      <el-table-column
        label="生产厂家"
        show-overflow-tooltip
        width="170px"
        prop="issueUnitName"
        align="center"
      ></el-table-column>
      <el-table-column
        label="生产批号"
        show-overflow-tooltip
        width="100"
        prop="batchNumber"
        align="center"
      ></el-table-column>
      <el-table-column
        label="数量"
        prop="actualCount"
        width="100"
        align="center"
      ></el-table-column>
      <el-table-column
        label="用途"
        show-overflow-tooltip
        width="100"
        prop="materialUsage"
        align="center"
      ></el-table-column>
      <el-table-column
        label="备注"
        show-overflow-tooltip
        min-width="100"
        prop="remark"
        align="center"
      ></el-table-column>
      <el-table-column label="操作" width="80px"  align="center"  prop="edit" fixed="right">
        <template slot-scope="scope">
          <el-link
            type="primary"
            @click="handleCheck(scope.row)"
            :underline="false"
            >选择</el-link
          >
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination
        background
        :page-size="pageVO.pageSize"
        :current-page.sync="pageVO.pageNo"
        :total="pageVO.total"
        layout="total, sizes, prev, pager, next, jumper"
        :page-sizes="[10, 20, 30, 50, 100]"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </el-dialog>
</template>
<script>
import { getInventoryNewList ,getOutNewList } from "@/api/inventory";
export default {
  data() {
    return {
      type: 1,
      tableData: [],
      total: 0,
      titlePrefix:'',
      pageVO: {
        pageNo: 1,
        pageSize: 10,
      },
      eidtVisable:false,
      dialogVisible: false,
    };
  },
  methods: {
    handleClose() {
      this.dialogVisible = false;
      this.tableData = [];
      this.pageVO = {
        pageNo: 1,
        pageSize: 10,
      };
    },
    openHandle() {
      this.dialogVisible = true;
      this.getTableData();
    },
    handleSizeChange(size) {
      this.pageVO.pageNo = 1;
      this.pageVO.pageSize = size;
      this.getTableData();
    },
    handleCurrentChange(num) {
      this.pageVO.pageNo = num;
      this.getTableData();
    },
    openDialogHandle(){
      this.titlePrefix='新增入库记录'
      this.eidtVisable = true
    },
    handleCheck(row){
      this.$emit('check',row)
      this.dialogVisible = false
    },
    getTableData() {
      let method = getInventoryNewList
      method({
        type: this.type,
        ...this.pageVO,
      }).then((res) => {
        const { data, total } = res.data || {};
        this.tableData = data || [];
        this.pageVO.total = total;
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.pagination {
  text-align: right;
  padding: 10px 0;
}
</style>
<style>
.el-table th.el-table__cell{
  background-color:#f2f2f2;
}
</style>
